<template>
  <van-row class="gl_py_20 team_content">
    <van-col :span="16">
      <van-row class="gl_px_15">
        <van-col class="user_name gl_py_5" :span="24">
          <span class="name gl_mr_10">{{ teamInfo.name }}</span>
        </van-col>
        <van-col class="birth_date gl_pt_5" :span="24">
          {{ teamInfo.provinceCode + teamInfo.cityCode + teamInfo.countyCode }}
        </van-col>
        <van-col :span="24">
          <van-tag class="gl_mr_10 gl_mt_5" size="medium" plain type="primary">{{ teamInfo.delegationType && teamInfo.delegationType.name }}</van-tag>
        </van-col>
      </van-row>
    </van-col>
    <van-col :span="8" align="center">
      <van-image
        round
        width="80px"
        height="80px"
        :src="getStaticFileUrl(teamInfo.imagePath)"
        @click="$imagePreview([getStaticFileUrl(individualInfo.imagePath)])"
      />
    </van-col>
  </van-row>
</template>
<script>
import { mapState } from 'vuex';
import { api_GET_EventsManagementDelegationId } from '@/extend/api/gameswaggerApi/app';
export default {
  data() {
    return {
      teamInfo: {}
    };
  },
  computed: {
    ...mapState({
      currentUserType: state => state.user.currentUserType
    })
  },
  created() {
    if (this.currentUserType) {
      this.getTeamInfo();
    }
  },
  methods: {
    // 获取团体信息
    getTeamInfo() {
      api_GET_EventsManagementDelegationId(this.currentUserType.delegationId, { IncludeDelegationType: true }).then(res => {
        this.teamInfo = res;
        this.$store.dispatch('user/getSaveCurrentUserTeamInfo', res);
      }, error => {
        this.$toast.fail(`获取团体信息失败！${error.error.message}`);
      });
    },
    // 获取静态文件
    getStaticFileUrl(relativeUrl) {
      if (relativeUrl) {
        return WEB_CONFIG.VUE_APP_STATIC_FILE_RUL + relativeUrl;
      } else {
        return require('@/assets/images/face_default.png');
      }
    }
  }
};
</script>
<style>
.team_content {
  position: relative;
  overflow: hidden;
  background: #fff;
}
.team_content::after {
  position: absolute;
  width: calc(100% - 30px);
  box-sizing: border-box;
  content: ' ';
  pointer-events: none;
  right: 16px;
  bottom: 0;
  left: 16px;
  border-bottom: 1px solid #ebedf0;
  -webkit-transform: scaleY(.5);
  transform: scaleY(.5);
}
.team_content .user_name {
  font-size: 14px;
  color: #333;
}
.team_content .birth_date {
  font-size: 12px;
  color: #666;
}
.tag_list {
  padding: 15px 15px 0;
}
</style>
